<template>
  <div class="work-center-main">
    <h1>个人中心</h1>
    <div>
      <van-grid :gutter="10">
        <van-grid-item
          v-for="(item, index) in gridItemList"
          :key="index"
          :icon="item.icon"
          :text="item.name"
          @click="handleClick(item.path)"
        />
      </van-grid>
    </div>
  </div>
</template>
<script lang="ts">
import { Vue, Options } from 'vue-class-component'

@Options({})
export default class WorkCenter extends Vue {
  gridItemList = [{
    icon: 'photo-o',
    name: '轮播图',
    path: '/'
  }, {
    icon: 'photo-o',
    name: '页面水印',
    path: '/'
  }, {
    icon: 'photo-o',
    name: '轮播图',
    path: '/'
  }, {
    icon: 'photo-o',
    name: '图片下载',
    path: '/'
  }, {
    icon: 'photo-o',
    name: '文件下载',
    path: '/'
  }, {
    icon: 'photo-o',
    name: 'pdf浏览',
    path: '/usePdfJs'
  }, {
    icon: 'photo-o',
    name: '多图打包下载',
    path: '/'
  }, {
    icon: 'photo-o',
    name: 'slot父子通信',
    path: '/useSlot'
  }]

  created () {
    console.log('this', this.$router)
  }

  handleClick (routePath: string) {
    console.log('jump')
    this.$router.push({
      path: routePath
    })
  }

  hello () {
    console.log('hello')
  }
}
</script>
